//
//  SportView.swift
//  Kosspot
//
//  Created by 李鑫 on 2025/6/19.
//

import SwiftUI
import URLImage

struct SportView: View {
    @StateObject var list = SportVM()
    @EnvironmentObject var appState :AppState
    var body: some View {
            VStack {
                VStack {
                    HStack {
                        Spacer()
                        Text("运动")
                            .font(.system(size: 18))
                            .foregroundStyle(.white)
                        Spacer()
                    }
                    .frame(height: 44)
                    .padding(.top,44)
                    Spacer().frame(height: 20)
                    ScrollView(.horizontal) {
                        HStack(spacing: 30) {
                            Spacer()
                            SportButtonView(imageName: "paobu", sportName: "跑步")
                            SportButtonView(imageName: "youyong", sportName: "游泳")
                            SportButtonView(imageName: "qixinig", sportName: "骑行")
                            SportButtonView(imageName: "tianjia", sportName: "添加")
                            Spacer()
                        }
                    }
                    .padding(.horizontal, 16)
                    .background(.clear)
                    Spacer().frame(height: 32)
                    HStack {
                        Text("健身咨询")
                            .font(.system(size: 16))
                            .foregroundStyle(.white)
                        Spacer()
                        Image("xiangyou")
                            .frame(width: 16,height: 16)
                            .onTapGesture {
                                appState.navigateTo(.fitnessList)
                            }
                    }.padding(.horizontal,12)
                    
                }
                .frame(height: 238)
                .gradientBackground(colors: [Color(hex: "#004641").opacity(1),Color(hex: "#001F16").opacity(0)], type: .linear(start: .top, end: .bottom), cornerRadius: 0)
                Spacer().frame(height: 16)
                List () {
                    ForEach(list.listModel?.data ?? []) {item in
                        SportNewCell(model: item)
                            .onTapGesture {
                                print("点击了")
                                // 执行跳转或数据操作
                                appState.navigateTo(.fitnessListDetail(id: item))
                            }
                    }
                }
                .listStyle(.plain)
                .environment(\.defaultMinListHeaderHeight, 0.1)
                .scrollIndicators(.hidden)
                .listRowInsets(EdgeInsets())
                .padding(.horizontal,16)
            }
            .background(Color(hex: "#0A0A0A"))
            .edgesIgnoringSafeArea(.all)
            .navigationBarHidden(true)
    }

}

#Preview {
    SportView()
}
struct SportButtonView: View {
     var imageName :String
     var sportName :String
    var body: some View {
        Button {
            
        } label: {
            VStack {
                Image(imageName)
                    .frame(width: 50,height: 50)
                Text(sportName)
                    .font(.system(size: 14))
                    .foregroundStyle(.white)
            }
        }
    }
}


struct SportNewCell: View {
    var model: Article
    var body: some View {
            VStack {
                ZStack(alignment:.leading) {
                    Color(hex: "#0A0A0A")
                    if let fullURL = URL(string: model.coverImageUrl){
                        URLImage(url: fullURL) { image in
                            image
                                .resizable()
                                .scaledToFit()
                                .aspectRatio(contentMode: .fill)
                                .frame(width: Bounds.width-32,height: 160)
                                .cornerRadius(16)
                                .padding(.top,12)
                                .clipped() // 确保图片不会超出其边界
                        }
                    } else {
                        Image("25 1")
                            .resizable()
                            .scaledToFit()
                            .aspectRatio(contentMode: .fill)
                            .frame(width: Bounds.width-32,height: 160)
                            .cornerRadius(16)
                            .padding(.top,12)
                            .clipped()
                    }
                    VStack(alignment: .leading, spacing: 8) {
                        Spacer().frame(height: 80)
                        Text(model.title)
                            .font(.system(size: 18))
                            .foregroundColor(.white)
                        
                        Text(model.content)
                            .font(.system(size: 14))
                            .foregroundColor(Color(hex: "#B0B0B0"))
                            .lineLimit(nil)
                        
                        Text(model.publishTimeStr)
                            .font(.system(size: 14))
                            .foregroundColor(.white)
                    }
                    .frame(height: 160)
                    .padding(.leading,16)
                }
                .padding(.top,0)
                .padding(.bottom,0)
            }
        .listRowSeparator(.hidden)
        .listRowInsets(EdgeInsets())
    }
}
